<template>
<div>
    <mt-header fixed :title="title">
    <mt-button icon="back" @click.native="goback()" slot="left">返回</mt-button>
    </mt-header>
    <div class="content" v-if="type">
      <div v-for="item of fieldList" :key="item.title">
      <mt-field v-if="item.type === 'input'" :label="item.title"  v-model="item.value"></mt-field>
      <mt-cell v-if="item.type === 'link'" :title="item.title" :to="item.link" is-link v-model="item.value"></mt-cell>
      </div>
      <div class="buttom">
      <mt-button type="primary" size="large" @click.native="submit">提交</mt-button>
      </div>
    </div>
    <div v-if="!type">
    <bulding v-if="!type"></bulding>
    </div>
</div>
</template>
<script>
import fieldLists from './data.js'
import bulding from '@/component/bulding.vue'
export default {
  data () {
    return {
      addImg: require('@/assets/image/add.svg'),
      type: this.$route.query.type,
      title: this.$route.query.title,
      fieldList: []
    }
  },
  components: {
    bulding
  },
  beforeRouteEnter (to, from, next) {
    next((vm) => {
      console.log(from.path)
      if (from.path === '/home') {
        vm.$store.commit('setCategory', '')
      }
    })
  },
  created () {
    this.fieldList = fieldLists[this.type]
  },
  methods: {
    goback () {
      this.$router.go(-1)
    },
    submit () {
      const param1 = {
        deviceid: Math.random(),
        devicename: this.fieldList[1].value,
        devicekurl: 'https://s3.amazonaws.com/sitewhere-demo/construction/meitrack/mt90.jpg',
        spectoken: ''
      }
      const param2 = {
        id: Math.random(),
        name: this.fieldList[0].value,
        imgUrl: 'http://47.105.172.250/fire/image/asset/pump.svg'
      }
      let param
      let commitFunction
      if (this.type === 'equipment') {
        param = param1
        commitFunction = 'setEquipment'
      } else {
        param = param2
        commitFunction = 'setNews'
      }
      this.$store.commit(commitFunction, param)
      this.$router.go(-1)
    }
  }
}
</script>
<style lang="less" scoped>
.content{
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;;
  padding: 40px 0 103px 0;
  .mint-button--primary{
    background: #17B887;
  }
  .buttom{
    padding: 40px;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
  }
}
</style>
